<div>
  <a-layout-sider collapsible v-model="collapsed" width="240">
    <div class="logo">LOGO</div>
    <a-menu
      theme="dark"
      mode="inline"
      :openKeys.sync="openKeys"
      :selectedKeys="selectedKeys"
      @select="onMenuItemSelect"
    >
      <a-sub-menu v-for="menuTree in menuTrees" :key="menuTree.key">
        <span slot="title">
          <a-icon :type="menuTree.type" />
          <span>{{ $t(menuTree.title) }}</span>
        </span>
        <template v-for="childMenu in menuTree.children">
          <a-menu-item v-if="hasPermission(childMenu.permissionSets)" :key="childMenu.key">
            <router-link :to="childMenu.path">{{ $t(childMenu.title) }}</router-link>
          </a-menu-item>
        </template>
      </a-sub-menu>
    </a-menu>
  </a-layout-sider>
</div>
